import React from 'react';
import { Form, Input, Button, InputNumber } from 'antd';
import { WhseBinSelect, WhseSelect } from '@/components/FormItemSelect';
import { FormattedMessage } from 'umi';
import QuerySelect from '@/components/QuerySelect';

const FormItem = Form.Item;

const formLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 14 },
};

export default class InvADJModal extends React.Component<any, any> {
  constructor(props: any) {
    super(props);
    this.state = {
      freshNum: 1,
      params: {
        whse: 'WGJ',
      },
    };
  }
  formRef: any = React.createRef();
  handleSubmit = (values: any) => {
    const { onSubmit } = this.props;
    if (typeof onSubmit === 'function') {
      onSubmit(values);
    }
  };
  setCurrent = (part?: any) => {
    const PartBOM: any = {};
    PartBOM.partNum = part.PartNum;
    PartBOM.partDescription = part.PartDescription;
    PartBOM.ium = part.IUM;
    this.formRef.current.setFieldsValue(PartBOM);
  };
  selectBin = (e: any) => {
    const { freshNum } = this.state;
    this.setState({ freshNum: freshNum + 1, params: { whse: e } });
  };
  componentDidMount() {
    const { formVals } = this.props;
    if (formVals) {
      this.formRef.current.setFieldsValue(formVals);
      this.setState({ loading: false });
    }
  }
  formRender = () => {
    const { formVals = {} } = this.props;

    return (
      <Form
        {...formLayout}
        ref={this.formRef}
        initialValues={formVals}
        onFinish={this.handleSubmit}
      >
        <FormItem label={<FormattedMessage id="pages.partNum" />} required>
          <Input.Group compact>
            <Form.Item
              noStyle
              name="partNum"
              rules={[
                { required: true, message: <FormattedMessage id="pages.partNum.required" /> },
              ]}
            >
              <Input style={{ width: 200 }} />
            </Form.Item>
            <Form.Item noStyle>
              <QuerySelect
                width={680}
                sysReportName="PartSearch"
                text={<FormattedMessage id="pages.select" />}
                title={<FormattedMessage id="pages.partNum" />}
                btntype="primary"
                setCurrent={this.setCurrent}
                scroll={{ x: 'max-content', y: '200px' }}
                params={{ InActive: 'false' }}
              />
            </Form.Item>
          </Input.Group>
        </FormItem>
        <WhseSelect
          label={<FormattedMessage id="pages.warehouseCode" />}
          showSearch={false}
          name={'warehouseCode'}
          params={{ wType: 'PassedWhse' }}
          required
          placeholder={<FormattedMessage id="pages.warehouseCode" />}
        />
        <FormItem name="binNum" label={<FormattedMessage id="pages.binNum" />}>
          <Input placeholder="pages.binNum" disabled />
        </FormItem>
        <FormItem name="onhandQty" label={<FormattedMessage id="pages.onhandQty" />}>
          <Input placeholder="pages.onhandQty" disabled />
        </FormItem>
        <FormItem name="lotNum" label={<FormattedMessage id="pages.lotNum" />}>
          <Input placeholder="lotnum" disabled />
        </FormItem>
        <WhseSelect
          label={<FormattedMessage id="pages.toWhseCode" />}
          showSearch={false}
          name={'toWhseCode'}
          params={{ wType: 'PassedWhse' }}
          placeholder={<FormattedMessage id="pages.toWhseCode" />}
          setCurrent={(e: any) => this.selectBin(e)}
          required
          rules={[{ required: true, message: <FormattedMessage id="pages.toWhseCode.required" /> }]}
        />
        <WhseBinSelect
          required
          showSearch
          name="toBinNum"
          label={<FormattedMessage id="pages.toBinNum" />}
          params={this.state.params}
          freshNum={this.state.freshNum}
          rules={[{ required: true, message: <FormattedMessage id="pages.toBinNum.required" /> }]}
        />
        <FormItem
          name="qty"
          label={<FormattedMessage id="pages.quantity" />}
          rules={[{ required: true, message: <FormattedMessage id="pages.quantity.required" /> }]}
        >
          <InputNumber min={0} />
        </FormItem>
        <FormItem name="reason" label={<FormattedMessage id="pages.invADJReason" />}>
          <Input />
        </FormItem>
        <FormItem wrapperCol={{ offset: formLayout.labelCol.span }}>
          <Button type="primary" htmlType="submit">
            <FormattedMessage id="pages.submit" />
          </Button>
        </FormItem>
      </Form>
    );
  };
  render() {
    const FormRender = this.formRender;

    return <FormRender />;
  }
}
